<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="css/estilos.css">
<title>Untitled Document</title>
{literal}
<style type="text/css">
    body{
        color:#333333;
		direction:ltr;
        font-family:Arial, Helvetica, sans-serif;
        font-size:11px;
		text-align:left;
    }
</style>
{/literal}

{literal}
<script src="http://maps.google.com/maps?file=api&amp;v=2&amp;key=ABQIAAAAnfs7bKE82qgb3Zc2YyS-oBT2yXp_ZAY8_ufC3CFXhHIE1NvwkxSySz_REpPq-4WZA27OwgbtyR3VcA&sensor=true_or_false" type="text/javascript"></script>
<script type="text/javascript">
    function initialize() {
      if (GBrowserIsCompatible()) {
        map = new GMap2(document.getElementById("map_canvas"));
		var center = new GLatLng(-0.23,-78.5);
		map.setCenter(center, 11);
		var customUI = map.getDefaultUI();
		map.enableDoubleClickZoom();
        map.setCenter(center, 11);
		
		
		// Create our "tiny" marker icon
		var tinyIcon = new GIcon();
		tinyIcon.image = "images/puntero.png";
		tinyIcon.shadow = "http://labs.google.com/ridefinder/images/mm_20_shadow.png";
		tinyIcon.iconSize = new GSize(24, 40);
		tinyIcon.shadowSize = new GSize(44, 40);
		tinyIcon.iconAnchor = new GPoint(12, 40);
		tinyIcon.infoWindowAnchor = new GPoint(5, 1);

		// Set up our GMarkerOptions object literal
		markerOptions = { icon:tinyIcon };
{/literal}{section name=eve loop=$eventos}{literal}
		{/literal}{if $eventos[eve].eve_nivel eq 3 or $eventos[eve].eve_creador eq $usuId}{literal}
                            	
        var coor = new GLatLng({/literal}{$eventos[eve].eve_latitud}{literal},{/literal}{$eventos[eve].eve_longitud}{literal});                             
		var marker{/literal}{$eventos[eve].eve_cod}{literal} = new GMarker(coor,markerOptions);

		GEvent.addListener(marker{/literal}{$eventos[eve].eve_cod}{literal}, "click", function() {
			marker{/literal}{$eventos[eve].eve_cod}{literal}.openInfoWindowHtml("<h3><b>{/literal}{$eventos[eve].eve_nombre}{literal}</h3><br /><b>Fecha:</b>&nbsp;&nbsp;{/literal}{$eventos[eve].eve_fecha}{literal}<br /><b>Hora:</b>&nbsp;&nbsp;{/literal}{$eventos[eve].eve_hora}{literal}:{/literal}{$eventos[eve].eve_minuto}{literal}<br /><b>Tipo:</b>&nbsp;&nbsp;{/literal}{$eventos[eve].eve_tipo}{literal}<br /><b>Descripcion:</b>&nbsp;&nbsp;{/literal}{$eventos[eve].eve_descripcion}{literal}");
		});
		map.addOverlay(marker{/literal}{$eventos[eve].eve_cod}{literal});
		{/literal}{/if}{literal}
		{/literal}{/section}{literal}
		map.setUI(customUI);
      }
    }
</script>
{/literal}
</head>

<body onload="initialize()" onunload="GUnload()">
	<a href="ingresarEvento.php" class="menu-agenda-ingresar">Crear nuevo evento</a>
    <div class="mapa" id="map_canvas" style="width: 600px; height: 300px; border:solid 1px;"></div>
    <div class="menu-ciudades">
    Ir a ciudad:
    <select>
    <option onclick="irACiudad(1)">Quito</option>
    <option onclick="irACiudad(2)">Guayaquil</option>
    <option onclick="irACiudad(3)">Cuenca</option>
    <option onclick="irACiudad(4)">Manta</option>
    </select>
    </div>
</body>
</html>
